<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>userIndex.jsp</title>
<link href="${pageContext.request.contextPath}/css/tcdPage.css" rel="stylesheet" type="text/css" />
</head>
<body>
	<table>
		<thead>
			<tr>
				<td>序号</td>
				<td>姓名</td>
			</tr>
		</thead>
		<tbody id="userTable">
		</tbody>
	</table>
	<div class="tcdPageCode"></div>
</body>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.page.js"></script>
<script type="text/javascript">
	$(function() {
		var param = {
			"name" : "admin"
		};
		loadUser("demo/page.do", 1, param);
	});

	/**
	 * ajax无刷新分页(递归回调)
	 */
	function loadUser(url, pageNo, param) {
		$.ajax({
			type : 'get',
			url : "${pageContext.request.contextPath}/" + url + "?pageNo=" + pageNo,
			data : param,
			dataType : 'json',
			success : function(obj) {
				var $user = $("#userTable");
				$user.empty();
				$.each(obj.data.list, function(i, item) {
					$user.append("<tr> " + "<td>" + (i + 1) + "</td>" + "<td>" + item.name + "</td>" + "</tr>");
				});
				$(".tcdPageCode").createPage({
					pageCount : obj.data.totalPage,
					current : obj.data.pageNo,
					backFn : function(p) {
						loadUser(url, p, param);
					}
				});
			}
		});
	}
</script>
</html>